<%--
  Created by IntelliJ IDEA.
  User: Ren
  Date: 2022/10/25
  Time: 21:27
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户查询病例</title>
    <!--引入elementui得样式-->
    <link type="text/css" rel="stylesheet" href="/css/index.css"/>
    <link type="text/css" rel="stylesheet" href="/css/moregood.css"/>
    <!--引入vue得依赖必须再elementui之前引入vue-->
    <script type="text/javascript" src="/js/vue.js"></script>
    <script type="text/javascript" src="/js/index.js"></script>
    <script type="text/javascript" src="/js/axios.min.js"></script>
    <script type="text/javascript" src="/js/qs.min.js"></script>
    <style>
        body{
            background-repeat: no-repeat;
            background-image: url("/imgs/looksun.jpg");
        }
        .el-table tr {
            background-color: #042831;
            color: #8E8E38;
        }
        #a{
            width: 327px;
            height: 200px;
            margin: 0 auto;
            margin-top: 190px;
        }
        #c{
            margin-left: 54px;
        }
        #e{
            margin-left: 50px;
        }
    </style>
</head>
<body>
        <div id="app">

            <div id="a">
            <!-- 表单区域 -->
            <el-form label-width="0px" class="login_form" :model="addForm">
                <el-form-item>
                    <el-input prefix-icon="el-icon-s-finance" v-model="addForm.mIdcard" placeholder="输入身份证号"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-input prefix-icon="el-icon-phone" v-model="addForm.mTelephone"
                              placeholder="输入手机号"></el-input>
                </el-form-item>

                <el-form-item class="btns"><!-- 按钮区域 -->
                    <el-button type="primary" id="d" @click="lookFor">查询</el-button>
                    <el-button type="primary" id="e" @click="fanhui">返回</el-button>
                    <el-button type="info" id="c" @click="reset">重置</el-button>
                </el-form-item>

            </el-form>
            </div>



            <el-dialog title="病例信息" :visible.sync="dialogTableVisible">
                <el-table :data="gridData"
                          :header-cell-style="getRowClass"
                >

                    <el-table-column property="cCases" label="病因" width="200">

                    </el-table-column>

                    <el-table-column property="cSuggest" label="医嘱">

                    </el-table-column>

                    <el-table-column property="dName" label="主治医师">

                    </el-table-column>

                </el-table>
            </el-dialog>









        </div>



</body>
<script>
    let app=new Vue({
        el:"#app",
        data:{
            addForm:{},
            gridData:[],
            dialogTableVisible:false,
        },

        created(){

        },

        methods:{
            fanhui(){
                location.href = "/userindex.html";
            },
            lookFor(){

                axios.get("/order/one?mIdcard="+this.addForm.mIdcard+"&mTelephone="+this.addForm.mTelephone).then(resp=>{
                    this.gridData=resp.data.data;
                    this.dialogTableVisible=true
                })
            },
            reset() {
                this.addForm = {};
            },
            // 表格奇偶层样式
            styleBack({ row, column, rowIndex, columnIndex }) {
                if ((rowIndex + 1) % 2 === 0) {
                    return "background:#053c4a; color:#fff;border:1px solid #053c4a";
                } else {
                    return "background:#042831; color:#fff;border:1px solid #042831";
                }
            },
            // 表头样式
            getRowClass({ rowIndex }) {
                return "background:#053c4a; color:#fff;border:3px solid #053c4a";
            },

        }

    })
</script>
</html>
